export default function (data) {
    let datas = {
        name: '编辑',
        fields: [{
            name: '仓库',
            searchValue: {
                value: '',
                SearchPath: '111'
            }
        }, {
            name: '地址',
            SelectorValue: {
                value: '上海',
                from: ['北京', '深圳']
            }
        }, {
            name: '仓库',
            value: 'value'
        }, {
            name: '流程',
            list: {
                insertAtTopPath: '111', elements: [{
                    deletePath: '111', editPath: '111', insertBelowPath: '111', values: [{
                        name: '流程1', value: '12',
                        list: {
                            insertAtTopPath: '111', elements: [{
                                deletePath: '111', editPath: '111', insertBelowPath: '111', values: [{
                                    name: '流程11', value: '12'
                                }]
                            }, {
                                deletePath: '111', editPath: '111', insertBelowPath: '111', values: [{
                                    name: '流程12', value: '12'
                                }]
                            }, {
                                deletePath: '111', editPath: '111', insertBelowPath: '111', values: [{
                                    name: '流程13', value: '12'
                                }]
                            }]
                        }
                    },
                    ]
                }]
            }
        }
        ]
    };
    // let datas = {name:'编辑',fields:[{name:'商品列表',list:{elements:[{values:[{name:'单价',value:'111'}]}]}}]}
    let style = `
                <style>
                   .add{
                    width: 15px;
                    height: 15px;
                    background: url("/Direct/com.nebutown.workflow.root.Root/commonui/assets/number_increase@2x.png");
                    background-size: 100%;
                    float: left;
                    font-size: 10px;
                   }
                   .wrap{
                    float: left;
                    width: 90%;
                    font-size: 20px;
                    margin-top: 10px;
                   }
                   .delete{
                    width: 15px;
                    height: 15px;
                    float: left;
                    font-size: 10px;
                    background: url("/Direct/com.nebutown.workflow.root.Root/commonui/assets/icon_delete@2x.png");
                    background-size: 100%;
                   }
                   .edit{
                    width: 15px;
                    height: 15px;
                    float: left;
                    font-size: 10px;
                    background: url("/Direct/com.nebutown.workflow.root.Root/commonui/assets/icon_edit@2x.png");
                    background-size: 100%;
                   }
                   .itemWrap{
                    float: left;
                    width: 95%;
                    border: 1px solid #999;
                    overflow: hidden;
                   }
                   .itemString{
                    width: 100%;
                   }
                   .insertBelow{
                    width: 15px;
                    height: 15px;
                    background: url("/Direct/com.nebutown.workflow.root.Root/commonui/assets/number_increase@2x.png");
                    background-size: 100%;
                    float: left;
                    font-size: 10px;
                   }
                </style>
    `
    let html = `
                `;

    function recursiveList(list) {
        let recursiveListString = '';
        let itemString = '';
        let itemWrapString = '';
        if (list.insertAtTopPath) {
            itemWrapString += `<div class="add" style="" path="${list.insertAtTopPath}"></div>`
        }
        list.elements.forEach((item) => {
            if (item.deletePath) {
                itemString += `<div class="delete" style="" path="${list.deletePath}"></div>`
            }
            if (item.editPath) {
                itemString += `<div class="edit" style="" path="${list.editPath}"></div>`
            }
            if (item.insertBelowPath) {
                itemString += `<div class="insertBelow" style="" path="${list.insertBelowPath}"></div>`
            }
            if (item.values) {
                item.values.forEach((item) => {
                    let itemStrings = '';
                    if (item.name) {
                        itemStrings += `<span>${item.name}:</span>`;
                    }
                    if (item.value) {
                        itemStrings += `<input type="text" value="${item.value}"/>`;
                    }
                    if (item.list) {
                        itemStrings = `${itemStrings}` + recursiveList(item.list)
                    }
                    itemString += `<div class="itemWrap">${itemStrings}</div>`;

                })
            }
        });
        itemWrapString += `<div class="wrap">${itemString}</div>`
        return `<div class="111" style="overflow: hidden">${itemWrapString}</div>`;
    };
    datas.fields.forEach((item) => {
        let itemKey = Object.keys(item)[1];
        let itemString = '';
        switch (itemKey) {
            case 'searchValue':
                itemString = `<div><span>${item.name}</span><input type="text" value="${item[itemKey].value}"/><button path="${item[itemKey].SearchPath}">搜索</button></div>`;
                break;
            case 'SelectorValue':
                let optionString = ``;
                item[Object.keys(item)[1]].form.forEach((item) => {
                    optionString += `<option>${item}</option>`;
                })
                itemString = `<div><span>${item.name}</span><select>
                                ${optionString}
                              </select></div>`;
                break;
            case 'list':
                itemString = `<div><span style="font-size: 20px">${item.name}</span>` + recursiveList(item.list) + `</div>`;
                break;

        }
        html += itemString;
    });
    html = `<form class="forms">${html}</form>`;
    window.nbasics.differAction(() => {

    });
    return (`<div>${style}${html}</div>`);
}
